<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8" import="libraryAdministration.*" import="java.util.*"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<script type="text/javascript" src="jq/jquery-1.11.1.js"></script>
<style type="text/css">
table.imagetable {
	font-family:arial,sans-serif;
	font-size:18px;
	color:#333333;
	border-width: 1px;
	border-color: #999999;
	border-collapse: collapse;
}
table.imagetable th {
	background:#FFC;
	border-width: 1px;
	padding: 8px;
	border-style: solid;
	border-color: #999999;
}
table.imagetable td {
	background:#FFF;
	border-width: 1px;
	padding: 8px;
	border-style: solid;
	border-color: #999999;
}
#id1,#notice{
	float:left;
	
}
#notice{
	color:#F00;
}
.imagetable{
	margin-top:15px;
	margin-left:0px;
}
</style>
<script type="text/javascript">
$(function(){
	//点击文本框输入书名
	$("#btnQuery").click(function(){
			if($.trim($("#TitleInquiry").val()).length==0){	//判断输入的书名是否为空
			$("#name").select();	//选择全部空格，方便下次输入
			$("#name").focus();		//获得焦点
			$("#notice").html("请输入书名！");
			return;
			}
		var str=/^[\u4e00-\u9fa5A-Za-z]+$/;	//中文和英文的正则表达式
		if(!str.test($("#TitleInquiry").val())){	//判断输入的是否符合条件
			$("#TitleInquiry").select();	//选择全部内容，方便下次输入
			$("#TitleInquiry").focus();		//获得焦点
			$("#notice").html("书名的输入不正确！");
			return;
		}
		var name=$("#TitleInquiry").val();
		window.location.href="TitleInquiry.jsp?name="+name;
	});
	
	//点击添加按钮
	$("#btnadd").click(function(){
		window.location.href="Add.jsp";	
	});	
	//点击修改按钮
	$("input[type='button'][name='modify']").click(function(){
		var id=$(this).parent().parent().children().eq(0).children().eq(0).val();//得到当前修改按钮的ID
		window.location.href="Modify.jsp?id="+id;
	});
	//点击复选框的变化
	$("input[type='checkbox'][name='selectit']:first").click(function(){
		$("input[type='checkbox'][name='selectit']").not(":first").prop("checked",$(this).prop("checked"));	
	});
	//勾选复选框删除图书
	$("input[type='button'][id='btndelete']").click(function(){
		var ids="";
		var i=0;
		$("input[type='checkbox'][name='selectit']").each(function(index, element) {
            if(index>0){
				if($(this).prop("checked"))	{
					var id=$(this).parent().parent().children().eq(0).children().eq(0).val();//得到当前复选框按钮的id
					ids+=id;
					i++;
					if(!$(this).is(":last")){//不是最后一个数
						ids+=",";
					}
				}		
			}
        });
		if(ids.length==0){
			alert("请勾选要删除的书！");
			return;
		}
		var answer=confirm("您确定要删除这"+i+"本书吗？");
		if(answer==true){
			window.location.href="DeleteBook?ids="+ids;
		}else{
			return;	
		}
		if(ids.length>0){
			
		}
	});
	
});
</script>
</head>
<body>
<div id="id1">
请输入您要查询的书名：
  <input type="text" name="TitleInquiry" id="TitleInquiry" width="275px" height="20px">
  <input type="button" name="btnQuery" id="btnQuery" value="查询">
  </div>
  <div id="notice"></div>
  <br>
<table class="imagetable">
<tr><th>序号</th><th>图书的名称</th><th>作者</th><th>价格</th><th>出版社</th><th>修改</th><th><input type="checkbox" name="selectit"/></th></tr>
<% 
request.setCharacterEncoding("UTF-8");
BookDao dao=new BookDao();
ArrayList<Book> books=dao.getBooks();//将所以书的信息存放在books中
int i=0;
for(Book book:books){	//遍历循环books
	i++;
%>
<tr><td><%=i%><input type="hidden" value="<%=book.getId() %>"/></td><td><%=book.getName() %></td><td><%=book.getAuthor() %></td><td><%=book.getPrice() %></td><td><%=book.getPress() %></td><td><input type="button" name="modify" value="修改"/></td><td><input type="checkbox" name="selectit"/></td></tr>
<%
}
%>
</table>
<br/>
<input type="button" id="btnadd" value="添加图书"/><input type="button" id="btndelete" value="删除图书"/>
</body>
</html>